<template>
    <div class="teacher-verification" :style="{ height: `${viewheight.GetViewHeight(175)}px` }">
        <el-scrollbar>
            <el-divider content-position="left">教师认证</el-divider>
            <div class="verification">
                <el-text type="danger" size="large">提示:请提交教师认证材料,认证成功后,您将可以使用教师的特殊的功能</el-text>
                <UploadFileComponent ref="uploadRef" :file-introd="''" :ismul="false" :islim="1" @uploademit="uploadEmit" />
                <el-button type="danger" @click="teaVerifica">点击认证</el-button>
            </div>
            <el-divider content-position="left">认证进度</el-divider>
            <div class="verification-progress">
                <el-text type="danger" size="large">{{ titleValue }}</el-text>
            </div>
        </el-scrollbar>
    </div>
</template>

<script setup lang="ts">
import UploadFileComponent from "@components/UploadFileComponent/UploadFileComponent.vue";
import { useViewHeightStore } from "@/store/viewheight";
import { ref, onMounted } from "vue";
import { Tsourcefile } from "@/models/sourcefile";
import { user_Verifica, user_getCheckStatus } from "@api/userapi";

const viewheight = useViewHeightStore();
const uploadRef = ref<InstanceType<typeof UploadFileComponent>>();
const titleValue = ref<string>("");

const teaVerifica = () => {
    uploadRef.value.uploadFileInfo()
}

const uploadEmit = async (uploadfile: Tsourcefile[]) => {
    console.log(uploadfile[0]);
    const res = await user_Verifica({ file_id: uploadfile[0].id });
    if (res.code === 200) {
        ElMessage.success(res.msg);
        titleValue.value = "审核已经提交到后台请等待！"
        return;
    }
    ElMessage.error(res.msg);
}

onMounted(async () => {
    const res = await user_getCheckStatus();
    if(res.code === 500){
        titleValue.value = res.msg;
    }
    if(res.code === 200){
        if(res.data.status === 0) {
            titleValue.value = "审核已经提交到后台请等待！"
        } else if(res.data.status === 1) {
            titleValue.value = "审核已经通过！"
        } else {
            titleValue.value = "审核不通过！"
        }
    }
})
</script>

<style scoped lang="less">
.teacher-verification {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;

    .verification {
        width: 600px;
        margin: 0 100px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        .el-text {
            margin-bottom: 20px;
        }
    }

    .verification-progress {
        width: 600px;
        margin: 0 100px;
        height: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}
</style>
